<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="resources/styles/clicki.web.css?V=20120501" media="screen" />
<link rel="stylesheet" type="text/css" href="resources/styles/clicki.loginandreg.css?V=20120501" media="screen" />
<link rel="stylesheet" type="text/css" href="resources/styles/clicki.webkitanimation.css?V=20120501" media="screen" />
<meta name="generator"
    content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
<title>注册页面</title>
<!--[if lte IE 9 ]><link rel="stylesheet" href="resources/styles/clicki.iehotfix.css?V=20120501" /><![endif]-->
<!--[if lte IE 9]>
<style>
body {background:#2f7fb2 url(resources/styles/images/topbg_01.png?V=20120501) top center no-repeat;}
html{height:100%;overflow:hidden;background:#2f7fb2 url(resources/styles/images/topbg_01.png?V=20120501) top center no-repeat;}
</style>
<![endif]-->

<style>
  footer {
    border-top: 9px ;
    width: 100%;
    margin-top: 5px;
}
    .Copyright {
    text-align: center;
    color: #959595;
    margin: 40px 0 0;
}
    #warning{  
    position:absolute;  
    color:red;  
    font-size: 20px;  
    font-weight: normal;  
    font-style: normal;  
    text-decoration: none;  
    } 
     
textarea:required:invalid, input:required:invalid {  
background-color: lightyellow;  
}
</style>
  <script type="text/javascript">
  function showps(){   
      if (this.forms.password.type="password") {  
          document.getElementById("box").innerHTML="<input type=\"text\" name=\"password\" id=\"password\" size=\"80\" style='width:\"150\";' value="+this.forms.password.value+">";   
          document.getElementById("click").innerHTML="<a href=\"javascript:hideps()\">隐藏密码</a>"  
      }  
  }   
  function hideps(){   
      if (this.forms.password.type="text") {  
          document.getElementById("box").innerHTML="<input type=\"password\" id=\"password\" name=\"password\" size=\"80\" style='width:\"150\";ime-mode:disabled' onkeyup=\"this.value=this.value.replace(/[\u4e00-\u9fa5]/g,'')\" value="+this.forms.password.value+">";   
          document.getElementById("click").innerHTML="<a href=\"javascript:showps()\">显示密码</a>"  
      }   
  }   
    function check(str){ 
        var temp="" 
        for(var i=0;i<str.length;i++) 
             if(str.charCodeAt(i)>0&&str.charCodeAt(i)<255) 
                temp+=str.charAt(i) 
        return temp 
    }  
    function validate() {
              var pwd1 = document.getElementById("password").value;
              var pwd2 = document.getElementById("password_check").value;
        <!-- 对比两次输入的密码 -->
              if(pwd1 == pwd2) {
                  document.getElementById("tishi").innerHTML="<font color='green'></font>";
                  document.getElementById("submit").disabled = false;
              }
              else {
                  document.getElementById("tishi").innerHTML="<font color='red'>两次密码不相同</font>";
                document.getElementById("submit").disabled = true;
              }
          }
    function recheck(str){
var re=/^[1](3|5|8)\d{9}$/
        if (re.test(str)){
          document.getElementById("xuexi").innerHTML=" ";
                  document.getElementById("submit").disabled = false;
        }
        else {
                  alert("输入格式不对，请重新输入");

              }
    }
    function clearNoNum(obj){
        //先把非数字的都替换掉，除了数字和.
        obj.value = obj.value.replace(/[^\d.]/g,"");
        //必须保证第一个为数字而不是.
        obj.value = obj.value.replace(/^\./g,"");
        //保证只有出现一个.而没有多个.
        obj.value = obj.value.replace(/\.{2,}/g,".");
        //保证.只出现一次，而不能出现两次以上
        obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
        //保证 数字整数位不大于11位
    }
    function clearNoNumn(obj){
        //先把非数字的都替换掉，除了数字和.
        obj.value = obj.value.replace(/[^\d.]/g,"");
        //必须保证第一个为数字而不是.
        obj.value = obj.value.replace(/^\./g,"");
        //保证只有出现一个.而没有多个.
        obj.value = obj.value.replace(/\.{2,}/g,".");
        //保证.只出现一次，而不能出现两次以上
        obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
        //保证 数字整数位不大于11位
        if(100<=parseFloat(obj.value))
            obj.value = "";
        if(parseFloat(obj.value)<0)
          obj.value="";
    }
  
  </script> 
</head>
<body>

<div class="theCenterBox" style="">
  <style>
.theCenterBox{width:670px; margin-top:3%;padding-bottom: :5%;}
</style>
  <div class="theLoginBox" style="width:657px">
    <div class="loginTxt">注册账号</div>
    <form id="leftForm" action="insregist.jsp" method="post" name="forms" >
      <div class="theLoginArea" id="loginBox">
        
        <p style="position: relative;">
          <label for="LoginForm_email"><span style="color: red;display: inline;border:0;font-size: 25px;">*</span>&nbsp账号：</label>
          <input placeholder="请输入账号" name="zhanghao" id="tt" type="text" required maxlength="255" style="ime-mode:disabled" onkeyup="this.value=this.value.replace(/[\u4e00-\u9fa5]/g,'')">
          <span>请输入您的账号</span> </p>

        <p style="position: relative;">
          <label for="LoginForm_password"><span style="color: red;display: inline;border:0;font-size: 25px;">*</span>&nbsp密码：</label>
          <span id="box" style="display: inline; border:0"><input placeholder="请输入您的密码" name="password" id="password" type="password" required maxlength="16" value="" /></span>
          <span id="click" style="display: inline; padding:0 0 0 260px; color:grey;border: 0"><a href="javascript:showps()">显示密码</a></span>  
          <span>请输入您的密码</span> </p>

        <p style="position: relative;">
          <label for="LoginForm_password"><span style="color: red;display: inline;border:0;font-size: 25px;">*</span>&nbsp确认密码：</label>
          <input placeholder="请确认您的密码" name="mima" id="password_check" type="password" maxlength="16" onblur="check()" value="" required onkeyup="validate()" />
          <span id="tishi" style="display: inline; padding:0 0 0 220px; border: 0"></span>
          <span>请确认您的密码</span> </p>

        <p style="position: relative;">
          <label for="LoginForm_email">邮箱：</label>
          <input placeholder="请输入您的邮箱" name="youxiang" id="LoginForm_email" type="email" maxlength="255" style="ime-mode:disabled" onkeyup="this.value=this.value.replace(/[\u4e00-\u9fa5]/g,'')">
          <span>请输入您的邮箱</span> </p>
        
        <p style="position: relative;">
          <label for="LoginForm_email">昵称：</label>
          <input placeholder="请输入您的昵称" name="LoginForm[name]" id="LoginForm_name" type="text" maxlength="255" />
          <span>请输入您的昵称</span> </p>

        <p style="position: relative;">
          <label for="LoginForm_email">年龄：</label>
          <input placeholder="请输入您的年龄" name="nianling" id="LoginForm_age" type="text" maxlength="255" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" onInput="clearNoNumn(this)"/>
          <span>请输入您的年龄</span> </p>
        
        <p style="position: relative;">
          <label for="LoginForm_email">性别：</label>
          <select name="xingbie" style="width: 300px; height: 43px;font-size: 20px;font-family: cursive; margin-top: 8px;">
          <option value="男" style="font-size: 20px;font-family: cursive;">男</option>
          <option value="女" style="font-size: 20px;font-family: cursive;">女</option>
          </select>          
          <span>请输入您的性别</span> </p>

        <p style="position: relative;">
          <label for="LoginForm_email">手机号：</label>
          <input placeholder="请输入您的手机号" name="shoujihao" id="LoginForm_phone"  type="text" maxlength="11" onInput="clearNoNum(this)" onblur="recheck(this.value)"/>
          <span id="xuexi" style="display: inline; padding:0 0 0 220px; border: 0"></span>
          <span>请输入您的手机号</span> </p>

        <p style="position: relative;">
          <label for="LoginForm_email">兴趣爱好：</label>
          <input placeholder="请输入您的爱好" name="aihao" id="LoginForm_email" type="text" maxlength="255" />
          <span>请输入您的爱好</span> </p>

        
        <p style="position: relative;">
          <label for="LoginForm_checksum">邀请码：</label>
          <input placeholder="请输入您的邀请码" name="yaoqingma" id="LoginForm_checksum" type="text" value="" />
          <span>请输入您的邀请码</span> </p>
        <div class="loginSubmitBnt">
          <div class="reg_submit">
            <input name="userSubmit" class="theSubmitButton" value="" type="submit" />
          </div>
        </div>
      </div>
      <div class="theRegArea fixRegHeight" id="reg_reg">
        <h2>没有邀请码？</h2>
        <br/>
        <a class="apply_reg" href="javascript:alert('验证码已经发送给您，注意查收');"></a> <br/>
        <h2>已经有账号？</h2>
        <br/>
        <a class="reg_login" href="Login.jsp"></a> 
        <div style="padding-left: 10px;padding-top: 50px">
            <img src="./resources/images/ww.gif"  height="100" width="220"  />       
             </div>
        </div>
    </form>
  </div>
  
 
</div>
 <footer>
   <div class="Copyright">
     <p>Design by Tactor</p>
   </div>
 </footer> 

</body>

</html>
    